<!--
 * @name: 
 * @Author: 刘大可
 * @Date: 2023-08-22 12:09:56
 * @LastEditors: 刘大可
 * @LastEditTime: 2023-08-22 18:08:29
-->
<template>
  	<div class="index">
		<uni-nav-bar @clickLeft	="back" leftIcon="left" statusBar :title="formData.pid?'回复评论':'添加评论'" fixed></uni-nav-bar>
		<view class="formDataBox bg-white margin padding">
			<uni-forms :modelValue="formData"  label-position="top" label-width	="300" >
				<uni-forms-item label="评论内容" name="name">
					<uni-easyinput type="textarea" v-model="formData.content" placeholder="请输入评论内容" :primaryColor="style.color" />
				</uni-forms-item>
				<uni-forms-item v-if="!formData.pid" label="评论图" name="name">
					<uni-file-picker :del-icon="false" limit="3" v-model="image" @select="selectTradeImage"></uni-file-picker>
				</uni-forms-item>
			</uni-forms>
			<view class="submit" @click="submit">
				{{ formData.pid ? '回复评论' : '添加评论' }}
			</view>
		</view>
    </div>
</template>

<script>
import Vue from 'vue';
import main from "@/middleware/main"
import info from "@/siteinfo"
export default Vue.extend({
  components: {},
  data() {
    return {
		formData:{
			content:"",
			image:""
		},
		image:[],
		style: {
			color: "#ff6344"
		},
	}
  },
  computed: {},
  methods: {
	back() {
		uni.navigateBack({ delta: 1 })
	},
	selectTradeImage(e){
		console.log(e);
		for (let i = 0; i < e.tempFilePaths.length; i++) {
			const element = e.tempFilePaths[i];
			this.upload(element).then(res => {
					console.log(res);
					if (res.code == 200) {
						this.formData.image = res.data
						this.image = [...	this.image,{
							url: res.data
						}]
					}
				})
			
		}
		
	},
	upload(res) {
		console.log(res);
		return new Promise((resolve, reject) => {
			uni.uploadFile({
				url: info.url + 'Base/Upload',
				// 仅为示例，非真实的接口地址
				filePath: res,
				header: {
					'content-type': 'application/x-www-form-urlencoded'
				},
				name: 'file',
				success: (result) => {
					var data = result.data;
					data = JSON.parse(data)
					if (data.status == 200) {
						data.code = data.status
						delete data.status
						resolve({
							code: 200,
							data: data.data
						})

					} else {
						this.tips.tips(data.msg)
						// resolve({
						//     code: 404,
						//     msg: data.data
						// })
					}
				}
			});

		})
	},
	submit(){
		uni.showLoading({
			title: '提交中…'
		});
		this.request("ZhBusinesss/comment_add",{
			...this.formData,
			image:this.image.map(item=>item.url)
		}).then(res=>{
			console.log(res);
			if (res.data.status == 200) {
				this.tips.success(res.data.msg).then(res => {
					uni.navigateBack({ delta: 1 })

				})
			}
			uni.hideLoading();
				
		})
	}

  },
  watch: {},

  // 页面周期函数--监听页面加载
  onLoad(e) {
	this.formData={
		...e,
		content: "",
		image: ""
	}
  },
  // 页面周期函数--监听页面初次渲染完成
  onReady() {},
  // 页面周期函数--监听页面显示(not-nvue)
  onShow() {},
  // 页面周期函数--监听页面隐藏
  onHide() {},
  // 页面周期函数--监听页面卸载
  onUnload() {},
  // 页面处理函数--监听用户下拉动作
  // onPullDownRefresh() { uni.stopPullDownRefresh(); },
  // 页面处理函数--监听用户上拉触底
  // onReachBottom() {},
  // 页面处理函数--监听页面滚动(not-nvue)
  // onPageScroll(event) {},
  // 页面处理函数--用户点击右上角分享
  // onShareAppMessage(options) {},
}) 
</script>

<style scoped>



.submit{
	width: 690rpx;
	margin: 30rpx 0;
	width: 630rpx;
	color: #333;
	background-color: #fade3d;
	height: 80rpx;
	border-radius: 100rpx;
	font-size: 32rpx;
	display: flex;
	align-items: center;
	justify-content: center;
}


</style>